<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>押金单</title>
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<link rel="shortcut icon" href="/favicon.ico">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">

<link rel="stylesheet" href="../css/common.css">
<link rel="stylesheet" href="../css/hardware.css">
<link rel="stylesheet" href="http://g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">

<script src="../../js/jquery-1.8.3.min.js"></script>
<script src="../js/zepto.js"></script>
<script src="../js/sm.js"></script>
<script src="../js/sm-extend.js"></script>
<script src="../js/jquery.form.js"></script>
<script type="text/javascript">
window.$$=window.Zepto = Zepto;
</script>
<style>
.check-team{border: 1px solid #d8dcdf;}
.row div{
	border-top: 1px solid #d8dcdf;
	border-right: 1px solid #d8dcdf;
	border-left: 1px solid #d8dcdf;
}
.row{
	border: 1px solid #d8dcdf;
}
.check-team td,th{
	border: 1px solid #d8dcdf;
}
.check-team h5{
	font-size: 14px;
}
</style>
</head>
<body>
	<div class="page">
		<header class="bar bar-nav">
			<a class="button button-link button-nav pull-left" href="javascript:window.history.back();" data-transition='slide-out'>
				<span class="icon icon-left"></span> 返回
			</a>
			<h1 class="title">押金单</h1>
		</header>

	<!-- 主体内容 -->
	<div class="content">
		<div class="D_content--wrap">
			<div id="listItemDiv">
			</div>
			<div class="list-remarks">
				<span class="re-txt" style="width:38%">押金单名称:</span>&nbsp;&nbsp;
				<input type="text" id="bill_name" name="bill_name" style="height: 28px; margin-left: 50px;" disabled="disabled"/>
<!-- 				<div class="item-input"> -->
<!--               <input type="text" placeholder="请输入押金单名称" id="bill_name" name="bill_name"> -->
<!--             </div> -->
			</div>
			<div class="list-remarks">
				<span class="re-txt" style="width:38%">所属房屋:</span>&nbsp;&nbsp;
				<select id="houseId" style="width:60%" disabled="disabled">
				</select>
			</div>
			
			<div class="list-remarks">
			<form method="post" enctype="multipart/form-data" id="form1">
						<div id="formContent"></div>
						<div class="progress"
							style="background: green;width: 0;display: none" id="progress">
							<div class="percent">0%</div>
						</div>
						<div id="status" style="display: block"></div>
						<div class="list-inline col-xs-3 piccontent" style="margin:5px;width:90% !important;" >
<!-- 						<input id="addLogo" class="btn btn-default btn-sm" type="file" name="titlefile" style="width: 24%;touch-action: none;">  </input> -->
						<img id="logopic" src="../images/idcard.png" 	style="margin-top: 20px;"> </input>
					</div>
					</form>
			</div>
<!-- 			<p style="position: fixed;left: 5%;width: 90%"><a href="javaScript:addpic()" class="button button-success">添加图片</a></p> -->
			<!-- 保存 -->
<!-- 			<div class="D_reserve--footer" style="position: fixed; bottom: 10px; width: -webkit-fill-available;"> -->
<!-- 				<a href="javascript:toSave();" class="D_reserve--btn" id="save" style="display: none;    float: left;width: 45%">保存</a> -->
<!-- 				<a href="javascript:toUpdate();" class="D_reserve--btn" id="update" style="display: none;float: left;width: 45%">修改</a> -->
<!-- 				<a href="javascript:todel();" class="D_reserve--btn" id="del" style="display: none;float: right;width: 45%;background: red">删除</a> -->
<!-- 			</div> -->
		</div>
		
		
	</div>
</div>

<script src="../../js/common.js"></script>
<script src="../js/checkList.js"></script>
<script type="text/javascript">
var checkType = $.getUrlParam("checkType");	//0:租客清单 1:业主清单 
var type = 1; 	//1:验房清单清单项
var userId = $.getUrlParam("userId");	//所选租客id或房东id
var billsId = $.getUrlParam("billsId");
// var listName = $.getUrlParam("listName")||"验房清单";

var inputid="";
var logoid="";
$(function(){
// 	checkList.initDefListItem( type ); //加载默认清单项
	loadHouseList( $("#houseId"), (checkType=="0"?"1":"0") );	//加载可选房子列表
	 $(document).on('change', '#addLogo', function () {
		    function getObjectURL(file) {
		        var url = null;
		        if (window.createObjectURL != undefined) { // basic
		            url = window.createObjectURL(file);
		        } else if (window.URL != undefined) { // mozilla(firefox)
		            url = window.URL.createObjectURL(file);
		        } else if (window.webkitURL != undefined) { // webkit or chrome
		            url = window.webkitURL.createObjectURL(file);
		        }
		        return url;
		    }
		    var objUrl = getObjectURL(this.files[0]);
			$("#logopic").attr("src",objUrl);
		});
	
});

 function loadHouseList($select,status){
 	$.ajax({
		url : "../../houseTransferList/getHouseList.do",
		data : {
//			status: status||""
		},
		type : "POST",
		dataType : 'json',
		cache : false,
		success : function(ret){
			var html = "";
			if(ret && ret.length>0){
//				$("#houseAddress").val(ret[0].address);
				$.each(ret,function(i,n){
					html += '<option value="'+n.houseId+'" data-address="'+(n.address||'')+'">'+n.houseName+' </option>';
				});
			}
			$select.html(html);
			if(billsId !=null){
				$("#update").show(); 
				$("#del").show();
				queryDetailById(billsId);
			}else{
				$("#save").show(); 
			}
		},
		error: function(){
			$$.toast('获取房子列表失败');	
		}
	}); 
}
// var count=0;
// function addpic(){
// 	var html="";
// 	html+="<input id=\"addLogo"+count+"\" class=\"btn btn-default btn-sm\" type=\"file\" name=\"titlefile\" style=\"width: 24%;touch-action: none;\">  </input>";
// 	html+="<img id=\"logopic"+count+"\" src=\"../images/idcard.png\" onclick=\"selpic(event,'addLogo"+count+"')\"	style=\"touch-action: none;\">";
// 	$(".piccontent").append(html);
// 	count++;
// }

function queryDetailById(billsId){
	$.ajax({
		type : "POST",
		dataType : 'json',
		url : "../../bills/queryDetailById",
		data : {
			id: billsId
		},
		success : function(data) {
		console.log(data);
		var ret=data.row[0];
		$("#bill_name").val(ret.bill_name);
		$("#houseId").val(ret.houseId);
		$("#logopic").attr("src",ret.imgUrl);
		}
	});
}

</script>
</body>
</html>